<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link rel="stylesheet" href="./css/bootstrap-datetimepicker.min.css">
    <link rel="stylesheet" href="./css/common.css">
    <title>考试管理</title>
    <style type="text/css">
        .user-center{
          font-size: 24px;
          line-height: 40px;
        }
        .user-center .user-name{
          font-size: 24px;
          line-height: 40px;
        }
       .user-img{
        width: 150px;
        height: 150px;
        display: block;
       }
       .modal input{
          height: 40px;
          line-height: 40px;
        }
       .modal label{
        line-height: 40px;
       }
       .color-red{
        color: red;
       }
    </style>
  </head>
  <body>
    <div class="header">
      <div class="container">
        <div class="header">
          <div class="float-left header-title">个人中心</div>
          <div class="float-right user-info">
            <div class="btn-group ml20 center-btn-group">
              <a href="javascript:void(0)" class="header-a" data-toggle="dropdown">
                <div class="user-cover"><img src="img/teacher-img-default.png" class="auto-img"></div>
                <div class="user-name"></div>
              </a>
              <ul class="dropdown-menu center-dropdown-menu">
                <!-- dropdown menu links -->
                <li><a href="javascript:void(0)" >个人中心</a></li>
                <li id="logout"><a href="javascript:void(0)">退出登录</a></li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="container mt20">
      <div class="user-center">
        <div><img src="img/teacher-img-default.png" class="user-img"></div>
        <div class="mt20">手机号码：<span class="user-accoutn"></span></div>
        <div class="mt20">唯一编号：<span class="user-number"></span></div>
        <div class="mt20">用户昵称：<span class="user-name"></span></div>
        <div class="mt20">超级管理员：<span class="super-user"></span><span class="ml20 color-red" id="invitecode_text"></span></div>
      </div>
      <button class=" mt20 btn btn-large btn-primary" id="edit_userinfo">编辑资料</button>
      <button class=" mt20 ml20 btn btn-large btn-primary" id="change_password">修改密码</button>
      <button class=" mt20 ml20 btn btn-large btn-primary hide" id="pro_invitecode">生成邀请码</button>
    </div>
    <!-- eiditmodal -->
    <div id="editModal" class="modal hide fade" tabindex="1" role="dialog" aria-labelledby="editModalLabel" aria-hide="true">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <h3 id="editModalLabel">修改个人资料</h3>
      </div>
      <div class="modal-body">
        <div class="clear-fix">
          <label class="float-left" for="user_name">用户昵称：</label>
          <div class="float-left">
            <input type="text" id="user_name" name="user_name" class="input-block-level" placeholder="请输入用户昵称">
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
        <button class="btn btn-primary modal-sure">确定</button>
      </div>
    </div>
    <!-- changeExamModal -->
    <div id="passwordModal" class="modal hide fade" tabindex="1" role="dialog" aria-labelledby="passwordModalLabel" aria-hide="true">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <h3 id="passwordModalLabel">修改密码</h3>
      </div>
      <div class="modal-body">
        <div class="clear-fix">
          <label class="float-left" for="password">原密码：</label>
          <div class="float-left">
            <input type="password" id="password" name="password" class="input-block-level" placeholder="请输入原密码">
          </div>
        </div>
        <div class="clear-fix">
          <label class="float-left" for="new_password">新密码：</label>
          <div class="float-left">
            <input type="password" id="new_password" name="new_password" class="input-block-level" placeholder="请输入新密码">
          </div>
        </div>
        <div class="clear-fix">
          <label class="float-left" for="sure_new_password">新密码：</label>
          <div class="float-left">
            <input type="password" id="sure_new_password" name="sure_new_password" class="input-block-level" placeholder="请确认新密码">
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
        <button class="btn btn-primary modal-sure">确定</button>
      </div>
    </div>
    <!-- 生成邀请码modal -->
    <div id="invitecodeModal" class="modal hide fade" tabindex="1" role="dialog" aria-labelledby="invitecodeModalLabel" aria-hide="true">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
        <h3 id="invitecodeModalLabel">生成邀请码</h3>
      </div>
      <div class="modal-body">
        <div class="clear-fix">
          <label class="float-left" for="invitecode_phone">手机号：</label>
          <div class="float-left">
            <input type="text" id="invitecode_phone" name="invitecode_phone" class="input-block-level" placeholder="请输入手机号码">
          </div>
        </div>
      </div>
      <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
        <button class="btn btn-primary modal-sure">确定</button>
      </div>
    </div>
    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="./js/jquery.min.js"></script>
    <script src="./js/bootstrap.min.js"></script>
    <script src="./js/bootstrap-datetimepicker.min.js"></script>
    <script src="./js/common.js"></script>
    <script src="./js/user-center.js"></script>
  </body>
</html>